<script setup lang="ts">
import { useRouter, useRoute } from "vue-router";

const router = useRouter();
const route = useRoute();

const toPrev = () => {
    router.push('/home')
};
const submitForm = () => {
    router.push({path: "/submit", query: { key: route.query.key }});
}
</script>

<template>
  <div class="my">
    <div class="my-top">
      <div class="my-nav">
        <img src="@/assets/toPrev.png" alt="" @click="toPrev()" />
        <div class="my-item">授权书</div>
      </div>

      <div class="cont_info">
        授权委托书，又称代理证书。它是由被代理人制作的，证明代理人之代理权并表明其权限范围的证书。授权委托书只存在于委托代理中，在法定代理中，不存在授权委托书。
      </div>
      <div class="cont_info">
        在实际生活中，介绍信也被作为授权委托书使用，司法实践承认其法律效力。授权委托书具有单独的证明力。实践中，代理人实施代理行为，只需出具授权委托书，即可表明其代理权的存在。授权委托书的各种事项应记载明确，委托书授权不明的，应作出不利于被代理人的解释。
      </div>
      <div class="cont_info">
        委托代理必须有委托授权，被代理人将代理权授予代理人，才能使代理人有权代理被代理人实施民事法律行为。委托代理的授权是要式行为，被代理人和代理人首先应当签订书面合同并依据该合同，由被代理人向代理人出具授权委托书。
      </div>
      <div class="submit">
        <el-button type="primary" @click="submitForm()">同意协议并继续</el-button>
      </div>
    </div>
  </div>
</template>

<style scoped>
.my {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.my-nav {
  position: relative;
  padding-top: 25px;
  margin-bottom: 12px;
}
.my-nav img {
  position: absolute;
  left: 16px;
}
.my-top {
  padding-bottom: 16px;
}
.my-top img {
  width: 10px;
  display: inline-block;
  padding-top: 25px;
  padding-left: 5px;
  top: 0;
}
.my-item {
  text-align: center;
  width: 100%;
}
.my-item1 {
  margin: 0 12px;
  width: 55px;
  height: 30px;
  line-height: 30px;
  font-size: 13px;
  color: #666666;
}
.my-item2 {
  display: flex;
}
.cont_info {
  margin: 20px 20px;
  line-height: 26px;
  font-weight: 400;
  color: #333333;
  font-family: "PingFang SC";
}
.submit {
    position: fixed;
    bottom: 20px;
    border-top: 1px solid #DCDCDC;
    left: 0;
    right: 0;
    padding-top: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.submit .el-button{
    background: #346EFE;
    border-radius: 20px;
    width: 60%;

}
</style>
